﻿<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%
String path = request.getContextPath() + "/";
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path;
%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<base href="<%=basePath%>">
	<meta charset="UTF-8">
	<title>选择素材</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="css/style2/d_common.css">
	<link rel="stylesheet" href="css/style2/common1.css">
	<script src="js/jquery-1.9.1.js"></script>
	<script src="js/layer/layer.js"></script>
	<script>
      var i = 120;
      Timeout();
      function Timeout(){
        if(i>0){
          i--;
          setTimeout(function(){Timeout();},1000);
        }else{
          window.location.href="<%=basePath%>declaimer/endread?devicecode=${devicecode}&guid=${user.guid}";
        }
      }
	</script>
</head>
<body>
<div class="header">
	<div class="logo">
		<a href="declaimer/first?guid=${user.guid}&devicecode=${devicecode}"><img src="img/n_logo.png" alt="">&nbsp; </a>
	</div>
	<div class="user">
		<img src="${user.pic==null?'img/man.png':user.pic==''?'img/man.png':user.pic }" alt="">
		<div class="admin">
			<span class="name">${user.name }</span><span class="number">【${user.cardno }】</span>
		</div>
		<a class="tuichu" href="declaimer/endread?devicecode=${devicecode}&guid=${user.guid}" style="background:#25c0f6;display: inline-block;padding: 5px;height: 30px;line-height: 30px;border-radius:5px;width: 80px;text-align: center;">退出</a>
	</div>
</div>

<div class="main ">
	<div class="main-list">
        <ul class="box">
        </ul>

        <div class="page">
            <ul>
                <li><a href="declaimer/mtype?cardno=${user.cardno }&guid=${user.guid }&devicecode=${devicecode}" class="classify">选择分类</a></li>
                <li><a href="javascript:;" onclick="userList('${user.cardno}');" class="material">我的素材</a></li>
                <li><a href="javascript:;" onclick="systemList();" class="default">默认素材</a></li>
                <li><a href="javascript:;" class="prev">上一页</a></li>
                <li style="margin-right: 0;"><a   href="javascript:;"
                                                  class="next">下一页</a></li>
            </ul>
        </div>


    </div>
</div>
<div class="footer">
	<div class="footer-content">
		<img src="img/wx.png" alt="" style="position: absolute;" class="footerimg1">
		<ul>
			<li style="margin-left: 36px;margin-top: 77px;font-size: 18px;"><span></span>欢迎使用信昇达朗读亭</li>
			<li style="margin-left: 36px;font-size: 18px;"><span></span>朗读亭提供朗读录制服务</li>
		</ul>
		<!--<c:if test="${isLogin!='1' }"><img src="https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=${ticket }" alt="" class="footerimg1"></c:if>-->
		<!--<c:if test="${isLogin=='1' }"><img src="img/wx.png" alt="" class="footerimg1"></c:if>-->
	</div>
	<div class="copyright" style="margin-top: 72px;font-size: 18px;">
		<%-- ${c.footer } --%>
	</div>
</div>

<script type="text/javascript">
  var cardno='';
  var pageNo=1;
  var totalPage = 1;
  $(document).ready(function() {
    pageNo=1;
    searchList();
  });
  function systemList(){
    pageNo=1;
    cardno = '';
    searchList();
  }
  function userList(cn){
    cardno = cn;
    if(cn==undefined ||cn==''){
      layer.msg("超时退出，请重新刷卡登录！",{icon:0,time:3000},function(){
        window.location.href="declaimer/first?devicecode=${devicecode}&guid=${user.guid}";
      });
      return;
    }
    pageNo=1;
    searchList();
  }
  $(".prev").click(function(){
    if(pageNo<2){
      layer.msg("当前处于首页！", {icon: 0});
    }else{
      pageNo--;
      searchList();
    }
  });
  $(".next").click(function(){
    if(pageNo>=totalPage){
      layer.msg("当前处于末页！", {icon: 0});
    }else{
      pageNo++;
      searchList();
    }
  });
  function searchList(){
    var url = 'declaimer/material_list?code=${code}&guid=${user.guid}';
    if(cardno!=''){
      url = 'declaimer/material_user_list?cardno=${user.cardno}&guid=${user.guid}';
    }
    $.ajax({
      async : false,
      cache : false,
      type : 'post',
      dataType : "json",
      data : {'pageNo':pageNo,'pageSize':15},
      url :  url,// 请求的action路径
      error : function(XMLHttpRequest, textStatus, errorThrown) {
        layer.msg("请求失败！");
      },
      success : function(data) {
        if(data.state=="9003"){
          layer.msg("没有权限！");
          return ;
        }else if(data.state=="9002"){
          layer.msg("请重新登录！");
          top.location.reload();
          return ;
        }
        var list = data.list;
        var strHtml = "";
        for(var i=0;i<list.length;i++){
          strHtml +='<li style="color:#fff;" onclick="window.location.href=\'<%=basePath%>declaimer/material_info?cardno=${user.cardno}&devicecode=${devicecode}&guid=${user.guid}&id='+list[i].id+'\'"><span>'+(i+1)+'、</span>'+list[i].title+'</li>';
          //隔行换色
          if(i%4==0){ //取模 求余数
            $(".box li").css({'background':'#06d897'});

          }else {
            $(".box li").css({'background':'#05b68c'});
          }
        }
        $(".box").html(strHtml);
        totalPage = data.totalPage;
      }
    });
  }
</script>
</body>
</html>